Системы управления веб-контентом

Формирование структуры сайта и навигации

Системы управления веб-контентом

План лекции

Основные вопросы

  • Проектирование логической структуры сайта
  • Создание и управление меню навигации
  • Вложенные меню
  • Работа с виджетами
  • Управление комментариями

Цели лекции

  • Понять принципы проектирования структуры сайта
  • Научиться создавать и настраивать меню навигации
  • Освоить работу с виджетами
  • Изучить управление комментариями и борьбу со спамом
Системы управления веб-контентом

Проектирование структуры сайта

Зачем нужна структура?

  • Понятность для пользователя — быстрый поиск информации
  • SEO-оптимизация — правильная перелинковка
  • Удобная навигация — снижение отказов
  • Масштабируемость — возможность расширения
  • Администрирование — систематизация контента

Типичные ошибки

  • Слишком глубокая вложенность
  • Дублирование информации
  • Нелогичное разделение
  • Отсутствие сайдбаров
  • Перегруженность разделов
Системы управления веб-контентом

Типы структур сайта

Иерархическая (древовидная)

Главная
├── О компании
│   ├── История
│   └── Команда
├── Услуги
│   ├── Услуга 1
│   └── Услуга 2
└── Контакты

Подходит для корпоративных сайтов

Линейная (последовательная)

  • Главная → Описание → Характеристики → Цены → Контакты
    Подходит для лендингов

Матричная (сетевая)

  • Гибкие связи между элементами
  • Теги, рубрики, фильтры
    Подходит для блогов, каталогов
Системы управления веб-контентом

Принципы проектирования структуры

Правило трёх кликов

  • Любая информация должна быть доступна не более чем за 3 клика от главной страницы
  • Минимизируйте вложенность разделов

Правило 7±2

  • Не перегружайте главное меню
  • Оптимально 5-7 пунктов меню
  • Оставшиеся поместите в подменю или футер

UX-принципы

  • Логичная группировка
  • Ясные названия разделов
  • Видимые текущие разделы (breadcrumbs, активное меню)
  • Возможность вернуться на предыдущий уровень
Системы управления веб-контентом

Карта сайта (Sitemap)

Что такое Sitemap?

  • Список всех страниц сайта
  • XML-файл для поисковых систем
  • Визуальная карта для проектирования

Как создать карту сайта в WordPress?

Способ 1: Плагины

  • Rank Math SEO
  • Yoast SEO
  • Google XML Sitemaps

Способ 2: Визуальное планирование

  • Используйте бумагу или онлайн-инструменты
  • Определите основные разделы
  • Проработайте подраздели
Системы управления веб-контентом

Меню навигации в WordPress

Что такое меню?

  • Ссылки на страницы, записи, рубрики
  • Структурированный список ссылок
  • Расположение на сайте (шапка, футер, мобильное меню)

Локации меню

  • Primary — главное меню (обычно в шапке)
  • Secondary — дополнительное меню
  • Footer — меню в подвале
  • Mobile — мобильное меню
  • Область определяется активной темой
Системы управления веб-контентом

Создание меню в WordPress

Шаги создания

  1. Войти в админ-панель
  2. Перейти в Внешний вид → Меню
  3. Нажать "создать новое меню"
  4. Ввести название меню
  5. Добавить элементы (страницы, записи, рубрики, ссылки)
  6. Перетащить для изменения порядка и вложенности
  7. Выбрать локацию меню
  8. Сохранить меню

Важно!

  • Сохраняйте изменения после каждого действия
  • Проверяйте предпросмотр
  • Тестируйте на разных устройствах
Системы управления веб-контентом

Добавление элементов в меню

Типы элементов

  • Страницы — существующие страницы сайта
  • Записи — отдельные записи блога
  • Рубрики — категории записей
  • Метки — теги записей
  • Произвольные ссылки — внешние URL

Фильтрация элементов

  • Используйте поиск по названию
  • Фильтр по типу контента
  • Отображение всех элементов или только опубликованных
Системы управления веб-контентом

Вложенные меню

Как создать вложенность?

  1. Перетащите элемент вправо
  2. Он станет подпунктом элемента над ним
  3. Можно создавать несколько уровней вложенности
  4. Пункты с подменю имеют индикатор

Пример структуры

Услуги                    ← уровень 1
├── Веб-разработка       ← уровень 2
│   ├── Корпоративные    ← уровень 3
│   └── Интернет-магазины
└── Маркетинг            ← уровень 2
    └── SEO-продвижение

Рекомендации

  • Не делайте более 3 уровней вложенности
  • Используйте понятные названия
  • Проверяйте на мобильных устройствах
Системы управления веб-контентом

Настройки элементов меню

Доступные настройки

  • Название в меню — отображаемое имя (отличается от названия страницы)
  • Класс CSS — для стилизации отдельного элемента
  • Ссылка — URL страницы
  • Отношение (XFN) — атрибут rel для SEO
  • Описание — текст всплывающей подсказки
  • Открывать в новой вкладке — target="_blank"

Использование

  • Изменяйте названия для краткости
  • Добавляйте описания для UX
  • Открывайте внешние ссылки в новых вкладках
  • Используйте CSS-классы для кастомизации
Системы управления веб-контентом

Местоположение меню (Menu Locations)

Что это?

  • Предопределённые области в теме
  • Связаны с функцией wp_nav_menu()
  • Различные темы имеют разные локации

Примеры локаций

  • Header Navigation — главное меню в шапке
  • Top Bar — верхняя панель
  • Footer Navigation — меню в подвале
  • Mobile Menu — мобильное меню

Проверка доступных локаций

  • Внизу страницы редактирования меню
  • Тема может иметь 1+ локаций
  • Одно меню можно назначить на несколько локаций
Системы управления веб-контентом

Кастомайзер для меню

Внешний вид → Кастомайзер

  • Живой предпросмотр изменений
  • Изменение порядка элементов
  • Мгновенное отображение на сайте

Преимущества

  • Видите результат сразу
  • Не нужно сохранять каждое действие
  • Можно изменить стили меню
  • Настройка мобильного меню

Настройки в кастомайзере

  • Выбор меню для локации
  • Изменение порядка
  • Включение/выключение мобильного меню
Системы управления веб-контентом

Управление меню через код (для разработчиков)

Регистрация локаций меню в functions.php

function register_my_menus() {
    register_nav_menus([
        'primary' => __('Главное меню', 'my-theme'),
        'footer' => __('Меню в подвале', 'my-theme'),
    ]);
}
add_action('after_setup_theme', 'register_my_menus');

Вывод меню в шаблоне

wp_nav_menu([
    'theme_location' => 'primary',
    'container' => 'nav',
    'container_class' => 'main-navigation',
    'menu_class' => 'nav-menu',
]);
Системы управления веб-контентом

Виджеты в WordPress

Что такое виджет?

  • Готовый функциональный блок
  • Небольшой элемент интерфейса
  • Размещается в специальных областях (widget areas)
  • Не требует программирования

Где размещаются виджеты?

  • Сайдбары — боковые колонки
  • Футер — подвал сайта (колонки)
  • Хедер — шапка (редко)
  • Тема определяет доступные области
Системы управления веб-контентом

Стандартные виджеты WordPress

Основные виджеты

  • Архивы — ссылки на архивы по месяцам
  • Календарь — календарь записей
  • Категории — рубрики записей
  • Метки — список меток
  • Последние записи — свежие материалы
  • Последние комментарии — новые отзывы
  • Страницы — список страниц сайта
  • Поиск — форма поиска
  • RSS — лента новостей
  • Текст — произвольный текст или HTML
Системы управления веб-контентом

Добавление и настройка виджетов

Путь: Внешний вид → Виджеты

  1. Выберите область (сайдбар, футер)
  2. Перетащите виджет в нужную область
  3. Настройте параметры виджета
  4. Сохраните изменения

Настройки виджета

  • Заголовок — название блока
  • Отображение — количество элементов
  • Сортировка — порядок вывода
  • Фильтры — условия отображения

Удаление виджета

  • Нажмите "Удалить" или перетащите из области
  • Настройки сохраняются автоматически
Системы управления веб-контентом

Виджет "Текст"

Возможности

  • Добавление произвольного текста
  • HTML-код (ссылки, форматирование)
  • Картинки (через img тег)
  • Формы (через плагины)
  • Рекламные блоки

Пример использования

<h3>Контакты</h3>
<p>📍 г. Минск, ул. Примерная, 1</p>
<p>📞 +375 (29) 123-45-67</p>
<p>✉ info@example.com</p>

Совет

  • Используйте для простой контактной информации
  • Не перегружайте сайдбар виджетами
Системы управления веб-контентом

Меню как виджет

Виджет "Произвольное меню"

  • Создайте меню заранее
  • Добавьте виджет "Произвольное меню"
  • Выберите созданное меню
  • Укажите заголовок
  • Сохраните

Использование

  • Дополнительная навигация в сайдбаре
  • Футер — ссылки на разделы
  • Мобильное меню — раскрывающийся список
  • Хлебные крошки — альтернативное меню

Отличие от основного меню

  • Может отличаться от главного
  • Отдельная структура
  • Можно использовать несколько меню
Системы управления веб-контентом

Местоположение виджетов (Widget Areas)

Зависит от темы

  • Различные темы имеют разные области
  • Колонки футера (1-4)
  • Сайдбары (левый, правый)
  • Специальные области

Проверка доступных областей

  • Внешний вид → Виджеты
  • Внешний вид → Кастомайзер → Виджеты
  • Отображение зависит от активной темы

Примеры

  • Sidebar-1 — основной сайдбар
  • Footer-1, Footer-2, Footer-3 — колонки футера
  • Header-1 — область в шапке
Системы управления веб-контентом

Виджеты для бизнеса

Полезные виджеты для коммерческого сайта

  • Контакты — телефон, адрес, email
  • Социальные сети — ссылки на профили
  • Последние товары — если есть интернет-магазин
  • Популярные записи — для SEO и вовлечения
  • Подписка на рассылку — форма сбора подписчиков
  • Баннер с акцией — рекламный блок

Где разместить?

  • Сайдбар — дополнительная информация
  • Футер — контакты, навигация
  • Внутри контента — виджеты плагинов
Системы управления веб-контентом

Дополнительные виджеты (через плагины)

Популярные плагины виджетов

  • Jetpack — набор виджетов WordPress.com
  • Widget Shortcode — вставка шорткодов
  • Recent Posts Widget Extended — расширенные записи
  • Social Icons Widget — иконки соцсетей

Установка плагинов виджетов

  1. Плагины → Добавить новый
  2. Поиск по названию
  3. Установка → Активация
  4. Появятся новые виджеты

Осторожно!

  • Не устанавливайте много плагинов
  • Проверяйте актуальность и рейтинг
  • Следите за производительностью
Системы управления веб-контентом

Управление комментариями

Зачем нужны комментарии?

  • Взаимодействие с аудиторией
  • Получение обратной связи
  • Пользовательский контент (UGC)
  • Улучшение SEO (активность)
  • Повышение вовлечённости

Где появляются комментарии?

  • Записи блога
  • Страницы (если включено)
  • Отдельные типы контента
  • Могут быть отключены глобально
Системы управления веб-контентом

Настройки комментариев

Путь: Настройки → Обсуждение

Основные настройки

  • Разрешить комментарии по умолчанию — для новых записей
  • Автоматическое закрытие — через N дней
  • Разбивать на страницы — при большом количестве
  • Древовидные/плоские — вложенность ответов
  • Количество на странице — ограничение
  • Количество уровней вложенности — максимум

Рекомендации

  • Включите автоматическое закрытие (30-60 дней)
  • Разбивайте на страницы при >50 комментариев
  • Ограничьте уровни вложенности (2-3)
Системы управления веб-контентом

Модерация комментариев

Процесс модерации

  1. Комментарий появляется на проверку
  2. Вы получаете уведомление на email
  3. Проверяете в админ-панели
  4. Одобряете, отклоняете или отмечаете спам

Где модерировать?

  • Комментарии → Все
  • Видите статус (ожидает, одобрено, спам)
  • Массовые действия (одобрить, удалить, спам)

Быстрая модерация

  • Наведите на комментарий → Быстрые действия
  • Модерация из email (одобрить/отклонить)
  • Настройка уведомлений
Системы управления веб-контентом

Ручная модерация

Критерии одобрения

  • Содержательное сообщение
  • Релевантность теме
  • Отсутствие спама
  • Корректный язык
  • Отсутствие оскорблений

Причины отклонения

  • Спам (реклама, бессмысленный текст)
  • Нарушение правил сайта
  • Некорректное поведение
  • Оскорбления

Рекомендации

  • Модерируйте регулярно
  • Опубликуйте правила комментирования
  • Отвечайте на комментарии
Системы управления веб-контентом

Антиспам защиты

Встроенные средства WordPress

  • Список ключевых слов — помечает как спам
  • Минимальная длина комментария — защита от короткого спама
  • Количество ссылок — ограничение гиперссылок
  • Электронная почта как логин — требует аккаунт

Настройки: Настройки → Обсуждение

  • Черный список ключевых слов (по одному на строку)
  • Модерация для N+ ссылок
  • Указать email для уведомлений
Системы управления веб-контентом

Плагины антиспама

Платные решения

  • Akismet — от WordPress.com (есть бесплатный план для личных блогов)
  • CleanTalk — облачная защита
  • Antispam Bee — популярный бесплатный плагин

Механизмы защиты

  • Проверка в реальном времени
  • Базы спамеров
  • Кэпча (reCAPTCHA)
  • Подписка на комментарии (подтверждение email)
  • Фильтрация по правилам

Рекомендация

  • Akismet + встроенные средства WordPress
Системы управления веб-контентом

Akismet: настройка

Установка и активация

  1. Плагины → Добавить новый → Akismet
  2. Установка → Активация
  3. Получите API-ключ на akismet.com
  4. Активируйте ключ в настройках

Настройки Akismet

  • Строгость фильтрации — что считать спамом
  • Удалять спам — автоматически или хранить
  • Проверять комментарии — по умолчанию включено
  • Показывать ссылку — "Комментарии защищены Akismet"

Статистика

  • Проверка эффективности в админке
  • Количество заблокированных спам-комментариев
Системы управления веб-контентом

Блокировка пользователей

Методы блокировки

  • IP-адрес — ограничение доступа
  • Email — блокировка по email
  • URL — фильтрация по ссылкам в комментариях
  • Имя — блокировка по никнейму

Где настроить?

  • Настройки → Обсуждение → Черный список
  • Плагины: Banhammer, Stop Spammers

Осторожно!

  • IP-адреса могут быть динамическими
  • Не блокируйте слишком широко
  • Регулярно просматривайте чёрный список
Системы управления веб-контентом

Модерация без регистрации

Разрешить неавторизованные комментарии

  • Настройки → Обсуждение
  • "Имя и email обязательны для комментирования"
  • "Пользователи должны быть зарегистрированы..."

Преимущества

  • Больше комментариев
  • Ниже барьер входа
  • Нет необходимости регистрации

Недостатки

  • Выше риск спама
  • Требуется модерация
  • Нет контроля над комментаторами
Системы управления веб-контентом

Комментарии для бизнеса

Где отключить комментарии?

  • Страницы "Контакты", "О компании" — отключите
  • Товарные страницы — обычно отключены
  • Блог — включите для обсуждений
  • Страницы услуг — зависит от стратегии

Альтернатива комментариям

  • Формы обратной связи — CF7, Contact Form
  • Социальные сети — обсуждения там
  • Отзывы — отдельный плагин (WooCommerce)
  • Чат — онлайн-поддержка

SEO-аспект

  • Комментарии влияют на свежесть контента
  • Ключевые слова в комментариях — +
  • Активность → выше позиции
Системы управления веб-контентом

Отключение комментариев

Глобально

  • Настройки → Обсуждение
  • Снимите галочку "Разрешить людям отправлять комментарии"

Для отдельных записей/страниц

  • При редактировании записи/страницы
  • Настройки экрана → "Обсуждение"
  • Снимите галочку "Разрешить комментарии"

Плагины для массового отключения

  • Disable Comments — глобальное отключение
  • Позволяет отключить для определённых типов контента
Системы управления веб-контентом

Практическое задание

Задание 1: Создать структуру сайта

  • Разработайте карту сайта для интернет-магазина одежды
  • Определите основные разделы (4-5 пунктов)
  • Создайте подраздели (2-3 уровня)

Задание 2: Создать меню

  • Создайте главное меню
  • Добавьте вложенные пункты
  • Создайте меню для футера
  • Назначьте меню на локации

Задание 3: Настроить виджеты

  • Добавьте виджеты в футер (2-3 колонки)
  • Добавьте контакты через виджет "Текст"
  • Добавьте виджет "Меню"

Задание 4: Настроить комментарии

  • Включите комментарии для блога
  • Настройте автоматическое закрытие через 30 дней
  • Установите плагин Akismet
Системы управления веб-контентом

Резюме лекции

Структура сайта

  • Правило трёх кликов
  • Правило 7±2
  • Иерархическая, линейная, матричная структуры
  • Карта сайта (Sitemap)

Меню навигации

  • Создание через Внешний вид → Меню
  • Вложенные меню (перетаскивание)
  • Настройки элементов меню
  • Локации меню (header, footer, mobile)

Виджеты

  • Стандартные виджеты WordPress
  • Добавление и настройка через Внешний вид → Виджеты
  • Местоположения виджетов (сайдбар, футер)
  • Плагины виджетов

Комментарии

  • Настройки через Настройки → Обсуждение
  • Модерация комментариев
  • Антиспам (Akismet)
  • Отключение комментариев
Системы управления веб-контентом

Вопросы для самопроверки

По структуре сайта

  1. Что такое правило трёх кликов?
  2. Какие типы структур сайта существуют?
  3. Как создать карту сайта в WordPress?

По меню навигации

  1. Как создать вложенное меню?
  2. Что такое локации меню?
  3. Как изменить название пункта меню?

По виджетам

  1. Что такое виджет?
  2. Какие стандартные виджеты есть в WordPress?
  3. Где разместить контакты на сайте?

По комментариям

  1. Как настроить автоматическое закрытие комментариев?
  2. Как работает Akismet?
  3. Где модерировать комментарии?
Системы управления веб-контентом

Полезные ресурсы

Документация WordPress

Плагины

Читайте ещё

  • Руководство по созданию меню
  • Топ виджетов для WordPress
  • Защита от спама